Givoxin - Charity Non Profit HTML Template
Thank you
First of all, thank you for purchasing the Givoxin HTML Template. You can find the detailed information about the template in this document. If there is anything you cannot find in this document, you can send an e-mail via the profile page.
1Installation
Follow the steps below to setup your site template:
- Unzip the downloaded package and open the
Templatefolder to find all the template files. You wil getgivoxin-bandgivoxin-cfolder in there. Both are containinghtmlfolder. You will need to upload you desire template to your hosting web server using FTP in order to use it on your website. - Below is the folder structure and needs to be uploaded to your website root directory:
givoxin/assets/css- Stylesheet filesgivoxin/assets/fonts- Icon/fonts filesgivoxin/assets/images- Image filesgivoxin/assets/inc- contact from filegivoxin/assets/js- js files
- You need to upload all or specific HTML files as per your need.
- And now you are ready to go to generate your webiste with this awesome template.
2HTML Structure
We are used Bootstrap4 framework in this template.
The general template structure is the same throughout the template. Here is the general structure.
#Favicon Settings
Favicon Will be found in head section.
<link rel="shortcut icon" href="assets/images/favicon.png" type="image/x-icon">
<link rel="icon" href="assets/images/favicon.png" type="image/x-icon">
#Logo Settings
The Logo will be found in the Theme Main Menu section.
<div class="logo"><a href="index.html"><img src="assets/images/resource/logo.png" alt=""></a></div>
You can replace any .jpg .png .svg logo.
#Fonts Settings
givoxin (Givoxin- Template) we use google fonts Roboto and Nunito
You can change both fonts form head section:
<link href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,600;0,700;0,800;0,900;1,300;1,400;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
#Contact Form
Activeted PHP Contact Form
You can edit your form simply and quickly. Open contact.php in inc folder and change following area
<?php
require_once('phpmailer/class.phpmailer.php');
require_once('phpmailer/class.smtp.php');
$mail = new PHPMailer();
//$mail->SMTPDebug = 3; // Enable verbose debug output
$mail->isSMTP(); // Set mailer to use SMTP
$mail->Host = 'yourhost.com'; // Specify main and backup SMTP servers
$mail->SMTPAuth = true; // Enable SMTP authentication
$mail->Username = 'username.com'; // SMTP username
$mail->Password = 'password'; // SMTP password
$mail->SMTPSecure = true; // Enable TLS encryption, `ssl` also accepted
$mail->Port = 465; // TCP port to connect to
$message = "";
$status = "false";
if( $_SERVER['REQUEST_METHOD'] == 'POST' ) {
if( $_POST['form_name'] != '' AND $_POST['form_email'] != '' AND $_POST['form_subject'] != '' ) {
$name = $_POST['form_name'];
$email = $_POST['form_email'];
$subject = $_POST['form_subject'];
$phone = $_POST['form_phone'];
$message = $_POST['form_message'];
$subject = isset($subject) ? $subject : 'New Message | Contact Form';
$botcheck = $_POST['form_botcheck'];
$toemail = 'yourmail@info.com'; // Your Email Address
$toname = 'thememx'; // Your Name
if( $botcheck == '' ) {
$mail->SetFrom( $email , $name );
$mail->AddReplyTo( $email , $name );
$mail->AddAddress( $toemail , $toname );
$mail->Subject = $subject;
$name = isset($name) ? "Name: $name
" : '';
$email = isset($email) ? "Email: $email
" : '';
$phone = isset($phone) ? "Phone: $phone
" : '';
$message = isset($message) ? "Message: $message
" : '';
$referrer = $_SERVER['HTTP_REFERER'] ? '
This Form was submitted from: ' . $_SERVER['HTTP_REFERER'] : '';
$body = "$name $email $phone $message $referrer";
$mail->MsgHTML( $body );
$sendEmail = $mail->Send();
if( $sendEmail == true ):
$message = 'We have successfully received your Message and will get Back to you as soon as possible.';
$status = "true";
else:
$message = 'Email could not be sent due to some Unexpected Error. Please Try Again later.
Reason:
' . $mail->ErrorInfo . '';
$status = "false";
endif;
} else {
$message = 'Bot Detected.! Clean yourself Botster.!';
$status = "false";
}
} else {
$message = 'Please Fill up all the Fields and Try Again.';
$status = "false";
}
} else {
$message = 'An unexpected error occured. Please Try Again later.';
$status = "false";
}
$status_array = array( 'message' => $message, 'status' => $status);
echo json_encode($status_array);
?>>
#CSS Structure
The style.css file contains all of the specific stylings for the page.
/* Givoxin HTML Template */
/************ TABLE OF CONTENTS ***************
1. Fonts
2. Reset css
3. Global css
4. Header Section
5. Banner Section
6. About Section
7. Info section
8. Funfacts Section
9. Working Process
10. CTA Section
11. Testimonials Section
12. Brand Logo Section
13. Blog Section
14. Course Section
15. Projects Section
16. Course Package Section
17. CTA Section
18. Two Column Section
19. Team Section
20. Pricing Section
21. Mission Section
22. History Section
23. Contact Form Section
24. Blog Page
<link href="assets/css/bootstrap.css" rel="stylesheet">
<link href="assets/css/fontawesome-all.css" rel="stylesheet">
<link href="assets/css/custom-animate.css" rel="stylesheet">
<link href="assets/css/animate.css" rel="stylesheet">
<link href="assets/css/jquery-ui-1.9.2.custom.min.css" rel="stylesheet">
<link href="assets/css/nice-select.css" rel="stylesheet">
<link href="assets/css/flaticon.css" rel="stylesheet">
<link href="assets/css/owl.css" rel="stylesheet">
<link href="assets/css/jquery.fancybox.min.css" rel="stylesheet">
<link href="assets/css/scrollbar.css" rel="stylesheet">
<link href="assets/css/swiper.min.css" rel="stylesheet">
<link href="assets/css/custom-menu.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<link href="assets/css/responsive.css" rel="stylesheet">
<link href="assets/css/color.css" rel="stylesheet">
-
style.css
All styles about template
#Javascript Structure
<script src="assets/js/jquery.js"></script>
<script src="assets/js/bootstrap.bundle.min.js"></script>
<script src="assets/js/jquery.fancybox.js"></script>
<script src="assets/js/isotope.js"></script>
<script src="assets/js/owl.js"></script>
<script src="assets/js/appear.js"></script>
<script src="assets/js/wow.js"></script>
<script src="assets/js/scrollbar.js"></script>
<script src="assets/js/TweenMax.min.js"></script>
<script src="assets/js/swiper.min.js"></script>
<script src="assets/js/jquery.ajaxchimp.min.js"></script>
<script src="assets/js/parallax-scroll.js"></script>
<script src="assets/js/jquery-ui-1.9.2.custom.min.js"></script>
<script src="assets/js/jquery.circle-progress.min.js"></script>
<script src="assets/js/knob.js"></script>
<script src="assets/js/jquery.nice-select.min.js"></script>
<script src="assets/js/script.js"></script>
<script src="assets/js/active.js"></script>
-
active.js
All Js script active here
#Mailchimp Settings:
Enter your subscription list url here:
#Credits
-
Bootstrap
-
Google Fonts
-
Stroke Icons from Flaticon
-
Fontawesome
-
Animate.css
#Support
Please send us mail hafizurbrohr@gmail.com You will get a reply 24 hours